<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>watch属性</title>
    <script src="../js/vue-dev.js"></script>
</head>
<body>

    <div id="app_watch">
        <p>Full Name is "{{fullName}}"</p>
    </div>

    <script>
        var app_watch = new Vue({
            el:'#app_watch',
            data:{
                firstName:'Tu',
                lastName:'Weiya',
                fullName:'TuWeiya'
            },
            watch:{
                //Listen to the property firstName
                //the first arg is 'this.firstName = "Yang" '
                firstName:function (value) {
                    this.fullName = value + this.lastName ;
                },
                lastName:function (value) {
                    this.fullName = this.firstName + value ;
                }
            }
        })
    </script>
</body>
</html>